<template>
	<view class='page_cont'>
		<view class='page_top'>
		    <view class='add_item'>
				<view class='title'>机构名称</view>
				<view class='add_text'><input class='input' type="text" maxlength="50" placeholder="格式: 贝贝乐少儿英语 (大良校区)" placeholder-style="color: rgba(149,152,163,0.5);font-size:28rpx"@input="input_name" :value="mech_info.mech_name"></input></view>
				<view class='img_box'></view>
		    </view>
		    <view class='add_item'>
				<view class='title'><view class='text'>地</view><view class='text'>区</view></view>
				<view class='add_text' @click="open_pop(1)">{{mech_info.mech_area?mech_info.mech_area:'点击获取所在地区地址'}}</view>
				<view class='img_box'><image class="icon" src="/static/icon43.png"></image></view>
		    </view>
		    <view class='add_item'>
				<view class='title'>机构地址</view>
				<scroll-view class='add_text scroll' scroll-x="true" scroll-with-animation="true" @click="choose_location()">{{mech_info.mech_addr1?mech_info.mech_addr1:'点击获取机构地址'}}</scroll-view>
				<view class='img_box'><image class="icon" src="/static/icon43.png"></image></view>
		    </view>
		    <view class='add_item'>
				<view class='title'>详细地址</view>
				<view class='add_text'><input class='input' type="text" placeholder="请输入详细地址" placeholder-style="color: rgba(149,152,163,0.5)" @input="input_address" :value="mech_info.mech_addr2"></input></view>
				<view class='img_box'></view>
		    </view>
		    <view class='add_item'>
				<view class='title'>机构电话</view>
				<view class='add_text'><input class='input' type="number" maxlength="11" placeholder="请输入您的手机号" placeholder-style="color: rgba(149,152,163,0.5)" @input="input_phone" :value="mech_info.phone"></input></view>
				<view class='img_box'></view>
		    </view>
			<view class='add_item'>
				<view class='title'>开业时间</view>
				<view class='add_text' @click="open_pop(2)">{{mech_info.time?mech_info.time:'点击获取开业时间'}}</view>
				<view class='img_box'><image class="icon" src="/static/icon43.png"></image></view>
			</view>
		</view>
		<view class="mech_limt">
		    <view class='title_wrap'>
				<view class='title'>教育范围</view>
				<view class='text'>请选择您所经营的教育类目，平台优先审核</view>
		    </view>
		    <view class='scroll_box'>
				<view class='left_wrap'>
					<scroll-view class="left_scroll" scroll-y="true" scroll-with-animation="true">
						<view class="limt_name " :class="cate_index==index?'active':''" v-for="(item,index) in cate_list" :key="index" @click="check_limt(index,item.id,item.name)">{{item.name}}</view>
					</scroll-view>
				</view>
		      <view class='right_wrap'>
					<scroll-view class="right_scroll" scroll-y="true" scroll-with-animation="true">
						<checkbox-group @change="checkboxChange">
							<block v-for="(item,index) in check_cate_list" :key="index">
								<label class="limt_item">
									<!-- #ifdef MP-WEIXIN -->
									<checkbox :value="[item.id,item.name]" :checked="item.checked" />
									<!-- #endif -->
									<!-- #ifdef H5 || APP-PLUS -->
									<checkbox :value="[item.id,item.name].join(',')" :checked="item.checked" />
									<!-- #endif -->
									<view class='txt'>{{item.name}}</view>
								</label>
							</block>
						</checkbox-group>
					</scroll-view>
				</view>
		    </view>
		</view>
		<view class='line'></view>
		<view class='mech_img'>
		    <view class='title_wrap'>
				<view class='title'>机构LOGO</view>
				<view class='text'>上传有效图片，建议尺寸750*750px</view>
		    </view>
		    <view class='choose_img' @click="choose_image(1)">
				<view class='choose_wrap' v-if="!mech_info.img1">
					<view class='img_box'><image class="icon" src="/static/icon49.png"></image></view>
					<view class='text'>请点击上传机构品牌标识Logo</view>
				</view>
				<image class="img" :src="mech_info.img1" mode="aspectFill" v-else></image>
		    </view>
		</view>
		<view class='line'></view>
		<view class='mech_img'>
		    <view class='title_wrap'>
				<view class='title'>营业执照</view>
				<view class='text'>上传有效图片，有机会被平台优先推荐展示</view>
		    </view>
		    <view class='choose_img' @click="choose_image(2)">
				<view class='choose_wrap' v-if="!mech_info.img2_choose">
					<view class='img_box'><image class="icon" src="/static/icon49.png"></image></view>
					<view class='text'>请点击上传营业执照</view>
				</view>
				<image class="img" :src="mech_info.img2_choose" mode="aspectFill" v-else></image>
		    </view>
		</view>
		<view class='line'></view>
		<view class='mech_img'>
		    <view class='title_wrap'>
				<view class='title'>法人身份证(正面)</view>
				<view class='text'>上传有效图片，优先通过审核</view>
		    </view>
		    <view class='choose_img' @click="choose_image(3)">
				<view class='choose_wrap' v-if="!mech_info.img3_choose">
					<view class='img_box'><image class="icon" src="/static/icon49.png"></image></view>
					<view class='text'>请点击上传法人身份证</view>
				</view>
				<image class="img" :src="mech_info.img3_choose" mode="aspectFill" v-else></image>
		    </view>
		</view>
		<view class='footer'>
		    <view class='xie_yi' @click="check_agree()"> 
				<image class='icon' :src="agree?'/static/icon46.png':'/static/icon45.png'"></image>
				<view class='text'>我已经阅读并同意 <text class='txt' @click.stop="nav_go(2)">商家入驻协议</text> 和 <text class='txt' @click.stop="nav_go(3)">商家入驻流程</text></view>
		    </view>
		    <view class="conf_btn" :class="agree?'active':''" @click="confirm_atte()">立即认证</view>
		</view>
		<pickerPop
			:showMask="show_mask"
			:showIndex="show_index"
			:title="title"
			:pickers="pickers"
			:value="picker_value"
			:address="address"
			:time="time"
			@closeMask="close_mask"
			@pickerChange="picker_change"
			@confirmValue="confirm_value"
		></pickerPop>
	</view>
</template>

<script>
	import PickerPop from "../../components/pickerPop.vue"
	import home from "../../api/home.js"
	import config from "../../api/config.js"
	import other from "../../utils/other.js"
	import util from "../../utils/util.js"
	export default{
		data(){
			return {
				address:false,
				time: false,
				show_mask: false,
				check_index: '',
				show_index: '',
				title: '',
				pickers: [],
				picker_value: [],
				area_value: [0,0,0],
				time_value: [0,0,0],
				cate_list: [],
				cate_index: 0,
				cate_name: '',
				check_cate_list: [],
				selcategory: [],
				mech_info: {
					mech_name: '',
					province: '',
					city: '',
					area: '',
					mech_area: '',
					addressIds: '',
					mech_addr1: '',
					lat: '',
					lng: '',
					mech_addr2: '',
					phone: '',
					time: '',
					img1: '',
					img2: '',
					img2_choose: '',
					img2_key: '',
					img3: '',
					img3_choose: '',
					img3_key: ''
				},
				agree: true,
				add: true,
				status: 1
			}
		},
		onLoad() {
			var that=this;
			that.times=other.dateTimePicker(1960,2020).dateTimeArray;
			//
			that.get_all_data();
			// #ifdef APP-PLUS
			uni.$on('addressInfo', that.addressUpdate)
			// #endif
		},
		onUnload() {
			const that = this
			// #ifdef APP-PLUS
			 uni.$off('addressInfo', that.addressUpdate)
			 // #endif
		},
		watch:{
			addressInfo(val){
				console.log(val,'地址');
			},
		},
		methods:{
			addressUpdate(data){
				console.log('add地址：' + JSON.stringify(data))
				this.mech_info.mech_addr1 = data.title
				this.mech_info.lat= data.location.lat
				this.mech_info.lng= data.location.lng
			},
			// 机构名
			input_name(e){
				this.mech_info.mech_name=e.detail.value;
			},
			// 选择地区
			open_pop(index){
				this.check_index=index;
				switch(index) {
				    case 1:
				        this.show_index=3;
						this.address=true;
				        this.picker_value=this.area_value;
				        this.show_mask=true;
				        break;
				    case 2:
						this.show_index=3;
						this.title='开业时间';
						this.time=true;
						this.picker_value=this.time_value;
						this.show_mask=true;
				        break;
				}
			},
			// 关闭选择框
			close_mask(){
				this.show_mask=false;
				this.address=false;
				this.time=false;
			},
			// 选择
			picker_change(res){
				// console.log(res)
				this.picker_value=res;
			},
			// 确认
			confirm_value(data){
				// console.log(data)
				var index=this.check_index;
				switch(index) {
				    case 1:
						this.area_value=this.picker_value;
						this.mech_info.province=data[0].shortName;
						this.mech_info.city=data[1].shortName;
						this.mech_info.area=data[2].shortName;
						this.mech_info.mech_area=data[0].shortName+' '+data[1].shortName+' '+data[2].shortName;
						this.mech_info.addressIds=data[0].provinceCode+','+data[1].cityCode+','+data[2].areaCode;
				        break;
					case 2:
						this.time_value=this.picker_value;
						this.mech_info.time=data[0]+'-'+data[1]+'-'+data[2];
					    break;
				}
				this.close_mask();
			},
			// 判断用户是否授权定位
			choose_location(){
			    var that=this;
				// #ifdef MP-WEIXIN
			    uni.getSetting({
					success: function (res) {
						if(res.authSetting["scope.userLocation"]){
							that.change_location()
						}else{
							// 重新授权
							uni.openSetting({
								success:function(res){
									if (res.authSetting["scope.userLocation"]) {
										that.change_location()
									}
								}
							})
						}
					}
			    })
				// #endif
				// #ifdef H5 || APP-PLUS
				that.change_location()
				// #endif
			},
			// 选择机构地址
			change_location(){
				// #ifdef MP-WEIXIN || H5
			    var that=this;
			    uni.chooseLocation({
					success(res){
						// console.log(res)
						that.mech_info.mech_addr1=res.name;
						that.mech_info.lat=res.latitude;
						that.mech_info.lng=res.longitude;
					},
			    })
				// #endif
				// #ifdef APP-PLUS
				uni.navigateTo({
					url:'../../mypage/searchAddress/index'
				})
				// #endif
			},
			// 详细地址
			input_address(e){
				this.mech_info.mech_addr2=e.detail.value;
			},
			// 机构电话
			input_phone(e){
				this.mech_info.phone=e.detail.value;
			},
			// 选择教育范围
			check_limt(index,id,name){
			    if(this.cate_index != index){
					this.cate_index=index;
					this.cate_name=name;
					this.check_cate_list=[];
					this.get_cate_list(id);
			    }
			},
			// 多选
			checkboxChange(e){
			    var cate_index=this.cate_index,cate_name=this.cate_name,selcategory=this.selcategory,add=true,ids=[],names=[];
			    var value=e.detail.value;
				console.log(value)
			    for (var i = 0; i < value.length; i++) {
					var row = value[i].split(",")
					ids = ids.concat(row[0])
					names = names.concat(row[1])
			    }
			    if(selcategory.length>0){
					for(var i=0;i<selcategory.length;i++){
						if(selcategory[i].index==cate_index){
							if(value.length>0){
								selcategory[i].ids=ids
								selcategory[i].names=names
							}else{
								selcategory.splice(i,1)
							}
							add=false
						}
					}
					if(add){
						var data={index:cate_index,name:cate_name,ids:ids,names:names};
						selcategory.push(data);
					}
			    }else{
					var data={index:cate_index,name:cate_name,ids:ids,names:names};
					selcategory.push(data);
			    }
			    this.selcategory=selcategory;
				console.log(this.selcategory)
			},
			// 上传图片
			choose_image(index){
			    var that = this;
			    wx.chooseImage({
			      count: 1,
			      sizeType: ['compressed'],
			      sourceType: ['album', 'camera'],
			      success: (res) => {
			        uni.showLoading({title: '上传中'})
			        that.get_oss(res,index)
			      }
			    })
			},
			// 勾选协议
			check_agree(){
				this.agree=!this.agree;
			},
			// 协议
			nav_go(index){
				uni.navigateTo({
					url: '../../mypage/webView/webView?index='+index
				})
			},
			// 提交信息
			confirm_atte(){
			    var info=this.mech_info,selcategory=this.selcategory,agree=this.agree,cate_list=this.cate_list,add=this.add,type=1,ids="",names="",parentIds=[],parentNames=[];
			    if(agree){
					if(!info.mech_name||util.testWord(info.mech_name)){
						util.page_show_toast('请填写机构名称',2000)
						return false;
					}
					if(!info.mech_area){
						util.page_show_toast('请选择机构地区',2000)
						return false;
					}
					if(!info.mech_addr1){
						util.page_show_toast('请选择机构地址',2000)
						return false;
					}
					if(!info.mech_addr2||util.testWord(info.mech_addr2)){
						util.page_show_toast('请填写机构详细地址',2000)
						return false;
					}
					if(!info.phone||!util.testMobile(info.phone)){
						util.page_show_toast('请填写正确的机构电话',2000)
						return false;
					}
					if(!info.time){
						util.page_show_toast('请选择机构开业时间',2000)
						return false;
					}
					if(selcategory.length==0){
						util.page_show_toast('请选择机构教育范围',2000)
						return false;
					}
					if(!info.img1){
						util.page_show_toast('请上传机构LOGO',2000)
						return false;
					}
					if(!info.img2){
						util.page_show_toast('请上传机构营业执照',2000)
						return false;
					}
					if(!info.img3){
						util.page_show_toast('请上传机构法人身份证正面照',2000)
						return false;
					}
					for(var i=0;i<selcategory.length;i++){
						if(selcategory.length>1&&selcategory[i].name=='学科辅导'){
							type=3
						}
						if(selcategory.length==1&&selcategory[i].name=='学科辅导'){
							type=2
						}
						ids=ids+","+selcategory[i].ids.join(",")
						names=names+","+selcategory[i].names.join(",")
						for(var j=0;j<cate_list.length;j++){
							if(selcategory[i].index==j){
								parentIds.push(cate_list[j].id)
								parentNames.push(cate_list[j].name)
							}
						}
					}
					ids=ids.substr(1);
					names=names.substr(1);
					var categoryParentIds=parentIds.join(","),categoryParentNames=parentNames.join(",");
					var params={
						"certify": {
							"idCardImg": info.img3,
							"certificateImg": info.img2,
							"idObjectKey":info.img3_key,
							"certificateObjectKey":info.img2_key
						},
						"business": {
							"name": util.removeAllSpace(info.mech_name),
							"serverPhone": info.phone,
							"score": "5",
							"province": info.province,
							"city": info.city,
							"region": info.area,
							"town": info.mech_addr1,
							"detail": util.removeAllSpace(info.mech_addr2),
							"addressIds": info.addressIds,
							"lat": info.lat,
							"lng": info.lng,
							"categoryIds": ids,
							"categoryNames": names,
							"categoryParentIds": categoryParentIds,
							"categoryParentNames": categoryParentNames,
							"type": type,
							"logoImg": info.img1,
							"foundTime": Date.parse(info.time)
						}
					}
					if(add){
						this.register_mech(params);
						// info.selcategory=selcategory;
						// wx.setStorageSync('register_mech_info', info)
					}
			    }else{
					util.page_show_toast('请先勾选同意家巴啦《商家入驻协议》和《商家入驻流程》',2000)
			    }
			},
			// 获取数据
			get_all_data(){
				this.get_province_list();
				this.get_classify_list();
				this.isFirStLogin();
			},
			// 获取省
			get_province_list(){
				config.get_province_list().then(res=>{
					var list=res.data.data;
					this.provinces=list;
					this.get_city_list(list[0].provinceCode,1)
				})
			},
			// 获取市
			get_city_list(code,type){
				var params={
					"pid": code
				}
				config.get_city_list(params).then(res=>{
					var list=res.data.data;
					this.citys=list;
					this.get_area_list(list[0].cityCode,type);
					if(type==2){this.pickers[1]=list}
				})
			},
			// 获取区
			get_area_list(code,type){
				var params={
					"pid": code
				}
				config.get_area_list(params).then(res=>{
					var list=res.data.data;
					this.areas=list;
					if(type==2){this.pickers[2]=list}
				})
			},
			// 获取分类
			get_classify_list(){
			    home.get_classify_list().then(res=>{
			        var list=res.data.data;
					list.forEach((item,index)=>{
						if(item.name=="附近机构"){
						  list.splice(index,1)
						}
					})
					this.cate_list=list;
			        this.get_cate_list(list[0].id)
			    })
			},
			// 获取子分类
			get_cate_list(id){
				uni.showLoading({})
				var selcategory=this.selcategory,cate_index=this.cate_index;
				console.log(this.selcategory)
			    var params={
					"parentId": id,
					"flagEnable": 1
				}
			    home.get_cate_list(params).then(res=>{
					uni.hideLoading()
			        var list=res.data.data;
					list.forEach((item)=>{
						item.checked=false;
					})
					if(selcategory.length>0){
						for(var i=0;i<selcategory.length;i++){
							if(selcategory[i].index==cate_index){
								for(var m=0;m<selcategory[i].ids.length;m++){
									for(var n=0;n<list.length;n++){
										if(list[n].id==selcategory[i].ids[m]){
											list[n].checked=true;
										}
									}
								}
							}
						}
					}
					this.check_cate_list=list;
					console.log(this.check_cate_list)
			    })
			},
			// 获取oss上传图片
			get_oss(file,index){
			    var that=this,randomStr=util.randomString(13),isPublic=index==1?true:false;
			    var params={
			      "isPublic": isPublic,
			      "isHttps": true
			    }
			    config.get_oss(params).then(res=>{
					var info=res.data.data;
					uni.uploadFile({
						url: info.host,
						filePath: file.tempFilePaths[0],
						name: 'file',
						formData: {
							"key": randomStr,
							"policy": info.policy,
							"OSSAccessKeyId": info.accessKeyId,
							"signature": info.signature,
							"success_action_status": '200'
						},
						success:function(){
							uni.hideLoading();
							var img=info.host+'/'+randomStr;
							// console.log(img);
							switch(index){
								case 1:
									that.mech_info.img1=img;
									break;
								case 2:
									that.mech_info.img2=img;
									that.mech_info.img2_key=randomStr;
									that.mech_info.img2_choose=file.tempFilePaths[0];
									break;
								case 3:
									that.mech_info.img3=img
									that.mech_info.img3_key=randomStr
									that.mech_info.img3_choose=file.tempFilePaths[0]
									break;
							}
						},
					})
			    })
			},
			// 认证机构
			register_mech(params){
				config.register_mech(params).then(res=>{
					uni.reLaunch({
						url: '../mechVerify/mechVerify?type=3&status='+this.status
					})
				})
			},
			// 查询是否有身份
			isFirStLogin(){
				config.isFirstLogin().then(res=>{
					if (res.data.data.accountProfile == null && res.data.data.accountBusinesses == null) {
						// 
						this.status=2
					}
				})
			},
		},
		components:{
			pickerPop: PickerPop
		}
	}
</script>

<style lang="scss">
	page{
		background: #F7F9FB;
		.page_cont{
			padding: 32rpx 0 0 0;
			.page_top{
				padding: 0 32rpx;
				background: #fff;
				border-radius: 16rpx;
				margin: 0 32rpx 32rpx 32rpx;
				.add_item{
					padding: 36rpx 0;
					border-bottom: 2rpx solid #F7F9FB;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: center;
					&:last-child{
						border-bottom: 0;
					}
					.title{
						width: 120rpx;
						height: 42rpx;
						font-size: 30rpx;
						font-weight:400;
						line-height: 42rpx;
						color:#424752;
						text-align: center;
						display: flex;
						.text{
							flex: 1;
							&:first-child{
								text-align: left;
							}
							&:last-child{
								text-align: right;
							}
						}
					}
					.add_text{
						flex: 1;
						margin: 0 24rpx;
						text-align: right;
						font-size: 30rpx;
						height: 42rpx;
						line-height: 42rpx;
						color: #5B90FF;
						overflow: hidden;
						.input{
						    height: 42rpx;
						    line-height: 42rpx;
						    color: #5B90FF;
						}
					}
					.scroll{
						white-space: nowrap;
					}
					.img_box{
						width: 24rpx;
						height: 24rpx;
						display: flex;
						.icon{
							width: 100%;
							height: 100%;
						}
					}
				}
			}
			.mech_limt{
				margin: 0 32rpx;
				.title_wrap{
					background: #fff;
					padding: 36rpx 32rpx;
					border-radius: 16rpx 16rpx 0 0;
					display: flex;
					flex-direction: row;
					align-items: center;
					.title{
						width: 122rpx;
						height: 42rpx;
						font-size: 30rpx;
						font-weight: 400;
						line-height: 42rpx;
						color:rgba(66,71,82,1);
						margin-right: 38rpx;
					}
					.text{
						height: 42rpx;
						font-size: 24rpx;
						font-weight: 400;
						line-height: 42rpx;
						color:rgba(149,152,163,0.5);
						overflow: hidden;
					}
				}
				.scroll_box{
					width: 100%;
					display: flex;
					flex-direction: row;
					.left_wrap{
						width: 120rpx;
						.left_scroll{
							width: 100%;
							.limt_name{
								background: #fff;
								border-left: 8rpx solid #fff;
								text-align: center;
								line-height: 40rpx;
								font-size: 28rpx;
								color: #9598A3;
								padding: 24rpx 32rpx 24rpx 24rpx;
							}
							.active{
								background: #F7F9FB;
								color: #424752;
								border-left: 8rpx solid #5B90FF;
							}
						}
					}
					.right_wrap{
						flex: 1;
						.right_scroll{
							padding-top: 30rpx;
							padding-left: 72rpx;
							overflow: hidden;
							box-sizing: border-box;
							.limt_item{
								float: left;
								margin-bottom: 48rpx;
								box-sizing: border-box;
								margin-right: 36rpx;
								display: flex;
								flex-direction: row;
								align-items: center;
								width: 200rpx;
								.txt{
									height: 40rpx;
									font-size: 28rpx;
									font-weight:400;
									line-height: 46rpx;
									color:rgba(66,71,82,1);
								}
							}
						}
					}
				}
			}
			.line{
				width: 100%;
				height: 32rpx;
				background: #fff;
				margin-bottom: 36rpx;
			}
			.mech_img{
				padding: 0 32rpx;
				.title_wrap{
					display: flex;
					flex-direction: row;
					align-items: center;
					.title{
						height: 42rpx;
						font-size: 30rpx;
						font-weight:400;
						line-height: 42rpx;
						color:rgba(66,71,82,1);
					}
					.text{
						flex: 1;
						text-align: right;
						height: 42rpx;
						font-size: 24rpx;
						font-weight:400;
						line-height: 42rpx;
						color:rgba(149,152,163,0.5);
					}
				}
				.choose_img{
					background: #fff;
					border-radius: 16rpx;
					margin: 32rpx 0;
					height: 340rpx;
					.choose_wrap{
						width: 100%;
						.img_box{
							width: 104rpx;
							height: 104rpx;
							padding: 82rpx 0 16rpx 0;
							margin: 0 auto;
							.icon{
								width: 100%;
								height: 100%;
							}
						}
						.text{
							text-align: center;
							height: 34rpx;
							font-size: 24rpx;
							font-weight: 400;
							line-height: 34px;
							color:rgba(149,152,163,0.5);
							margin-bottom: 62rpx;
						}
					}
					.img{
						width: 100%;
						height: 100%;
						border-radius: 16rpx;
					}
				}
			}
			.footer{
				width: 100%;
				padding: 64rpx 32rpx 48rpx 32rpx;
				background: #fff;
				box-sizing: border-box;
				.xie_yi{
					display: flex;
					flex-direction: row;
					padding: 0 54rpx;
					margin-bottom: 32rpx;
					.icon{
						width: 28rpx;
						height: 28rpx;
						margin-right: 16rpx;
						margin-top: 2rpx;
					}
					.text{
						flex: 1;
						height: 34rpx;
						font-size: 24rpx;
						font-weight:400;
						line-height: 34rpx;
						color:#9598A3;
						.txt{
						  color: #5B90FF;
						}
					}
				}
				.conf_btn{
					height: 88rpx;
					line-height: 88rpx;
					background: rgba(91,144,255,0.5);
					border-radius: 16rpx;
					font-size: 36rpx;
					font-weight:600;
					text-align: center;
					color: #fff;
					letter-spacing:10rpx;
				}
				.active{
				  background: rgba(91,144,255,1);
				}
			}
		}
		/*checkbox 选项框大小  */
		checkbox .wx-checkbox-input {
		  width: 28rpx;
		  height: 28rpx;
		  border: 2rpx solid rgba(149,152,163,1);
		  border-radius: 6rpx;
		}
		/*checkbox选中后样式  */
		checkbox .wx-checkbox-input.wx-checkbox-input-checked {
		  background: #5B90FF;
		  border-color:#5B90FF;
		}
		/*checkbox选中后图标样式  */
		checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
		  width: 20rpx;
		  height: 20rpx;  
		  line-height: 20rpx;
		  text-align: center;
		  font-size: 22rpx;
		  color: #fff;
		  background: transparent;
		  transform: translate(-50%, -50%) scale(1);
		  -webkit-transform: translate(-50%, -50%) scale(1);
		}
	}
</style>
